<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>分享</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <style>
        html,
        body,#vm {
            background: rgba(190, 190, 190, 0.3);
            height: 100%;
            width:100%;
            margin:0;
            padding:0;
        }

        footer {
            background-color: #fff;
            position: fixed;
            bottom: 0px;
            text-align: left !important;
        }


        .queding {
            text-align: center;
            height: 41px;
            line-height: 41px;
            font-size: 14px;
            background: #ea5413;
            color: #fff;
            border-radius: 8px;
            width:80%;
            margin: 10px 10%;
        }

        .wechatpay {
            border-bottom: 1px solid #f3f3f3;
            line-height: 45px;
            font-size: 13px;
            padding: 0px 20px;
        }

        .wx {
            width: 28px;
            height: 28px;
            display: inline;
            vertical-align: middle;
        }

        .zhifubao {
            width: 28px;
            height: 18px;
            display: inline;
            vertical-align: middle;
        }

        .xuan {
            float: right;
        }

        .radio {
            width: 18px;
            height: 18px;
            display: inline;
            vertical-align: middle;
        }

    </style>
</head>

<body>
    <div id="vm" @click="closeframe1()">
        <footer class="aui-bar aui-bar-tab" id="footer">
            <div class="wechatpay" style="line-height:30px;font-size:13px;">
                选择支付方式
            </div>

            <div class="wechatpay" @click.stop="wxchoice()">
                <img src="../image/my/chart.png" alt="" class="wx"> 微信支付
                <div class="xuan">
                  <img v-bind:src="xuanzhongimg" alt="" class="radio" v-if="iswxchoiceflag">
                  <img v-bind:src="weixuanimg" alt=""  v-else  class="radio" >
                </div>
                <div class="aui-clearfix"></div>
            </div>
            <div class="wechatpay"  @click.stop="alipaychoice()">
                <img src="../image/VIP/zhifubao.png" alt="" class="zhifubao"> 支付宝支付
                <div class="xuan">
                  <img v-bind:src="xuanzhongimg" alt="" class="radio"  v-if="isalichoiceflag" >
                  <img v-bind:src="weixuanimg" alt="" v-else  class="radio">
                </div>
                <div class="aui-clearfix"></div>
            </div>
            <div class="queding" @click.stop="quedingframe()">确定</div>

        </footer>
    </div>
</body>
<script type="text/javascript" src="../script/md5.js"></script>
<script type="text/javascript" src="../script/paythiry1.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/zepto.js"></script>
<script type="text/javascript" src="../script/vue.2.5.js"></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/rest.js"></script>
<script type="text/javascript" src="../script/faskclick.js"></script>
<script type="text/javascript">
    var uid,session
    var vm = new Vue({
        el: '#vm',
        data: {
            iswxchoiceflag: true,
            isalichoiceflag: false,
            weixuanimg: '../image/48.png',
            xuanzhongimg: '../image/114.png',
            cash:'0.01',
            payid:''
        },
        methods: {
            init: function() {
                var _this = this;
                uid= $api.getStorage('uid');
                session= $api.getStorage('session');
                if ('addEventListener' in document) {
                  document.addEventListener('DOMContentLoaded', function() {
                      FastClick.attach(document.body);
                  }, false);
                }
                api.addEventListener({
                    name: 'loginsuccess'
                }, function(ret, err){
                    _this.init()
                });

            },
            alipaychoice: function() {
                var _this = this;
                _this.iswxchoiceflag = false;
                _this.isalichoiceflag = true;
            },
            wxchoice: function() {
                var _this = this;
                _this.iswxchoiceflag = true;
                _this.isalichoiceflag = false;

            },
            quedingframe(){
              var _this = this;
              _this.cash=api.pageParam.videocash;
              _this.payid=api.pageParam.videoid;
              uid= $api.getStorage('uid');
              session= $api.getStorage('session');

              if(uid){
                if(_this.iswxchoiceflag){
                  var data1={
                    _uid:uid,
                    session:session,
                    cash:_this.cash,
                    type:22,
                    pay_id:_this.payid
                  }
                }else{
                  var data1={
                    _uid:uid,
                    session:session,
                    cash:_this.cash,
                    type:12,
                    pay_id:_this.payid
                  }
                }
                thirdpay.pay(data1,_this.iswxchoiceflag)
              }else{
                api.openFrame({
                    name: 'login_introduction',
                    url: './myself/login_introduction.html',
                    rect: {
                        x: 0,
                        y: 0,
                        w: 'auto',
                        h: 'auto'
                    },
                    bounces: false,
                    bgColor: 'rgba(0,0,0,0.7)',
                    vScrollBarEnabled: true,
                    hScrollBarEnabled: true
                });
                setTimeout(function() {
                  api.closeFrame();
                }, 200)
              }
              api.addEventListener({
                  name: 'paysuccess'
              }, function(ret, err){
                  api.closeFrame();

              });
            },
            closeframe1(){
              if (api.pageParam.value==1) {
                  api.sendEvent({
                      name: 'playvideoad'
                  });
                  setTimeout(function() {
                    api.closeFrame();
                  }, 1000)
              }else {
                  api.sendEvent({
                      name: 'bofang'
                  });
                  setTimeout(function() {
                    api.closeFrame();
                  }, 1000)
              }
            }
        }
    })

    //
    // $('html,body').on('click', function() {
    //       api.closeFrame();
    // })

</script>

</html>
